Normalitzar estils CSS pels navegadors

NORMALITZAR ESTILS

Quan desenvolupem llocs web, és comú trobar petites diferències en el rendiment visual entre els diferents navegadors. Això és degut a les discrepàncies en la forma en què els navegadors interpretan i apliquen els estils per defecte. Per abordar aquest problema, es pot utilitzar una llibreria com normalize.css.

Hi ha molts tipus de navegadors que s'utilitzen en una multitud de dispositius diferents. Els més utilitzats i coneguts són Google Chrome (Un dels navegadors més utilitzats a nivell mundial), Mozilla Firefox (conegut per la seva personalització i enfocament a la privadesa), Apple Safari (navegador predeterminat en dispositius Apple com Mac i iPhone), Microsoft Edge (navegador de Microsoft basat en Chromium, el mateix motor que utilitza Google Chrome), Opera (conegut per les seves característiques innovadores i el seu enfocament a l'estalvi de dades) o Brave (Un navegador centrat en la privadesa i la seguretat). N'hi ha altres menys coneguts com, per exemple, Vivaldi, Tor Browser, Pale Moon, Midori, Waterfox, Samsung Internet, Opera mini, DuckDuckGo Privacy Browser, UC Browser, Firefox Focus o Puffin browser.

Normalize.css és una llibreria CSS que pretén fer que els estils per defecte siguin més coherents entre els diferents navegadors. En comptes de restablir tots els estils a zero, com fa un reset CSS complet, normalize.css ajusta i millora els estils per defecte de manera que es comportin de manera més consistent i previsible.

COM APLICAR LA NORMALITZACIÓ?

Entreu a la web de normalize.css i baixeu-vos el full d'estils css fent clic dret al botó vermell "download". Poseu el fitxer en la carpeta css i linkeu-lo al vostre exercici.

Dins de l'element HTML head, primer poseu el link a normalize.css i després a sota poseu el link al vostre fitxer styles.css. Posem el normalize.css a sobre perquè si canviem alguna cosa en el nostre css sobreescrigui per cascada els estils. Aquesta és la manera correcta de normalitzar els estils en CSS.

Hi ha molts conceptes en el normalize.css que ara no entendreu però al final del curs sí que ho entendreu si torneu a revisar aquest full d'estils. El full CSS de normalize està comentat per explicar els diferents canvis que s'apliquen.